/* 根节点 */
#login-view {
    -fx-background-color: black;
    -fx-background-image: url("bg.png");
    -fx-background-position: 30% 30%; /* 设置背景图片位置 */
}

#login-panel{
    -fx-translate-x: 600;
    -fx-translate-y: 100;
    -fx-spacing: 20;
}


/* title-box */
#title-v-box {
    -fx-spacing: 10;
    -fx-alignment: center;
}

#title-v-box > .title {
    /* 线性渐变 从左上角到右下角*/
    -fx-fill: linear-gradient(to right bottom, #009ef3, #00e9d0);
}

#title-v-box > .first-title {
    -fx-font-size: 50;
}

#title-v-box > .last-title {
    -fx-font-size: 30;
}

/* border */
#top-left-border,
#top-right-border,
#bottom-left-border,
#bottom-right-border {
    -fx-pref-width: 35;
    -fx-pref-height: 35;
    -fx-border-insets: -2;
    -fx-border-color: #20a3f5;
}

#top-left-border {
    -fx-border-width: 2 0 0 2;
}

#top-right-border {
    -fx-border-width: 2 2 0 0;
}

#bottom-left-border {
    -fx-border-width: 0 0 2 2;
}

#bottom-right-border {
    -fx-border-width: 0 2 2 0;
}


/* login-box */
#login-grid-pane {
    -fx-pref-width: 600;
    -fx-pref-height: 400;
    -fx-vgap: 20;
    -fx-alignment: center;
    -fx-border-color: #186baf;
    -fx-border-width: 2;
    -fx-background-color: rgba(32, 163, 245, 0.1);
}

#login-grid-pane > .user-login-text {
    -fx-font-size: 24;
    /*-fx-fill: #f40041;*/
    -fx-fill: #00bff4;
}

#login-grid-pane > .field-h-box {
    -fx-alignment: center;
    -fx-border-width: 2;
    -fx-border-color: rgba(32, 163, 245, 0.4);
    -fx-background-color: rgba(32, 163, 245, 0.1);
}

#login-grid-pane > .field-h-box > .username-image-view {
    -fx-image: url("username.png");
}

#login-grid-pane > .field-h-box > .password-image-view {
    -fx-image: url("password.png");
}


#login-grid-pane > .field-h-box > .text-field,
#login-grid-pane > .field-h-box > .password-field {
    -fx-pref-width: 340;
    -fx-font-size: 18;
    -fx-text-fill: white;
    -fx-background-color: rgba(32, 163, 245, 0.1);
}


#login-grid-pane > .check-box,
#login-grid-pane > .hyperlink {
    -fx-text-fill: white;
    -fx-font-size: 16;
}

#login-grid-pane > .check-box > .box {
    -fx-background-color: rgba(32, 163, 245, 0.1);
    -fx-border-width: 2;
    -fx-border-color: rgba(32, 163, 245, 0.5);
}

/* 复选框选中时 */
#login-grid-pane > .check-box:selected > .box > .mark {
    -fx-background-color: #439aff;
}

#login-grid-pane > .hyperlink {

}

#login-grid-pane > .button {
    -fx-pref-width: 400;
    -fx-background-color: #20a3f5;
    -fx-font-size: 24;
    -fx-text-fill: white;
}

#login-grid-pane > .button:hover {
    -fx-background-color: #137bd6;
}